<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
 <%@include file="/WEB-INF/jsp/common/common.jsp" %>   
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
		<style>
			body {
				padding: 20px;
				/*overflow-y: scroll;*/
			}
		</style>
</head>
<body>
	<table class="layui-table" id="demo" lay-filter="demo">
	
	</table>

</body>
</html>


		<script type="text/html" id="barDemo">
			<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
		</script>

	<script>
		layui.use('table', function() {
					var $ = layui.jquery;
					var table = layui.table;
					table.render({
							elem: '#demo',
							url: '${ctx}/employee/listAllData',
							page: {  //开启分页
								
							},
							cols: [
									[ //标题栏
									  {
											field: 'id',
											title: 'ID',
											width: 100,
											fixed: 'left',
											unresize: true,
											sort: true
										},
										{
											field: 'name',
											title: '联系人',
											width: 180
										}
										, {
											field: 'img',
											title: '头像',
											width: 180,
											rowspan: 2,
											templet: '<div><img src="{{d.img}}"/></div>'
										},
										 {
											fixed: 'right',
											title: '操作',
											toolbar: '#barDemo',
											width: 150
										}
									]
								]
							});
					
					
					table.on('tool(demo)', function(obj) {
						var data = obj.data;
						console.log(data);
						if(obj.event === 'del') {
							layer.confirm('真的删除行么'+data, function(index) {
								//obj.del();
								layer.close(index);
								var url ="${ctx}/employee/delete/"+data.id;
								alert(url);
								$.post(url,function(data){
									alert(data);
									obj.del();
								},"text");
							});
						} else if(obj.event === 'edit') {
							/* layer.prompt({
								formType: 2,
								value: data.username
							}, function(value, index) {
								obj.update({
									username: value
								});
								layer.close(index);
							}); */
							
							layer.open({
								  type: 1,
								  content: $('#edit'),
								  yes: function(index, layero){
									    alert("x");
									    layer.close(index); //如果设定了yes回调，需进行手工关闭
									},
									cancel: function(index, layero){ 
										  if(confirm('确定要关闭么')){ //只有当点击confirm框的确定时，该层才会关闭
										    layer.close(index)
										  }
										  return false; 
									}   
							});
							
						}
					});
					
			}); //layui 结束
	</script>
	
	
	
	<div id="edit"  style="display: none;">
			<form class="layui-form" action="">
			  <div class="layui-form-item">
			    <label class="layui-form-label">输入框</label>
			    <div class="layui-input-block">
			      <input type="text" name="title" required  lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
			    </div>
			  </div>
			  <div class="layui-form-item">
			    <label class="layui-form-label">密码框</label>
			    <div class="layui-input-inline">
			      <input type="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
			    </div>
			    <div class="layui-form-mid layui-word-aux">辅助文字</div>
			  </div>
			  <div class="layui-form-item">
			    <label class="layui-form-label">选择框</label>
			    <div class="layui-input-block">
			      <select name="city" lay-verify="required">
			        <option value=""></option>
			        <option value="0">北京</option>
			        <option value="1">上海</option>
			        <option value="2">广州</option>
			        <option value="3">深圳</option>
			        <option value="4">杭州</option>
			      </select>
			    </div>
			  </div>
			  <div class="layui-form-item">
			    <label class="layui-form-label">复选框</label>
			    <div class="layui-input-block">
			      <input type="checkbox" name="like[write]" title="写作">
			      <input type="checkbox" name="like[read]" title="阅读" checked>
			      <input type="checkbox" name="like[dai]" title="发呆">
			    </div>
			  </div>
			  <div class="layui-form-item">
			    <label class="layui-form-label">开关</label>
			    <div class="layui-input-block">
			      <input type="checkbox" name="switch" lay-skin="switch">
			    </div>
			  </div>
			  <div class="layui-form-item">
			    <label class="layui-form-label">单选框</label>
			    <div class="layui-input-block">
			      <input type="radio" name="sex" value="男" title="男">
			      <input type="radio" name="sex" value="女" title="女" checked>
			    </div>
			  </div>
			  <div class="layui-form-item layui-form-text">
			    <label class="layui-form-label">文本域</label>
			    <div class="layui-input-block">
			      <textarea name="desc" placeholder="请输入内容" class="layui-textarea"></textarea>
			    </div>
			  </div>
			  <div class="layui-form-item">
			    <div class="layui-input-block">
			      <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
			      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
			    </div>
			  </div>
			</form>
	</div>
	